<!-- 首页的每个引导大标题 -->
<template>
	<view class="navbar">
		<view :style="{ fontSize : fontSize + 'rpx' }" class="title">{{title}}</view>
		<navigator :url="url" v-if="isIcon">
			<view class="title-icon">
				<view class="text">{{text}}</view>
				<view>
					<uni-icons color="#ff0000" :type="icon" size="14"></uni-icons>
				</view>
			</view>
		</navigator>


	</view>
</template>

<script setup>
	defineProps({
		url: {
			type: String,
			default: ''
		},
		title: {
			type: String,
			default: '标题引导'
		},
		text: {
			type: String,
			default: ''
		},
		icon: {
			type: String,
			default: 'back'
		},
		isIcon: {
			type: Boolean,
			default: true
		},
		fontSize: {
			type: Number,
			default: 32
		}

	})
</script>

<style lang="scss" scoped>
	@import '@/uni.scss';

	.navbar {
		display: flex;
		justify-content: space-between;
		align-items: center;
		// padding: 30rpx 20rpx 20rpx 30rpx;
		padding: 20rpx 30rpx;
		direction: rtl;

		.title {
			padding-left: 80rpx;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
		}

		.title-icon {

			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 20rpx;
			color: $App-title-color;
		}
	}
</style>